<!DOCTYPE HTML>
<html lang="zh-cn">
  <head>
  	<meta charset="UTF-8">
    <title>Powerful JQuery Plugins</title>
    <link href="/js/jQueryUI/jquery-ui.css" type="text/css" rel="stylesheet"></link>
    <link href="/js/jQueryScrollbar/perfect-scrollbar.css" type="text/css" rel="stylesheet"></link>
	<style type="text/css">
		#scroll {
			position: relative;
			height: 100%;
		}
	</style>
  </head>
  
  <body>
  	<div id="dlg"></div>
  	<div id="scroll" style="width:400px;height:400px;">
  		<img src="/img/test/scroll.jpg" alt="滚动条插件">
  	</div>
  	<script src="/js/jQuery/jquery-1.11.3.js" type="text/javascript"></script>
  	<script src="/js/jQueryUI/jquery-ui.js" type="text/javascript"></script>
  	<script src="/js/jQueryValidation/jquery.validate.js" type="text/javascript"></script>
  	<script src="/js/jQueryValidation/messages_zh.js" type="text/javascript"></script>
  	<script src="/js/jQueryValidation/additional-methods.js" type="text/javascript"></script>
  	<script src="/js/jQueryValidation/additional-methods.js" type="text/javascript"></script>
  	<script src="/js/jQueryScrollbar/perfect-scrollbar.jquery.js" type="text/javascript"></script>
  	<script type="text/javascript">
  		$(function() {
  			$("#dlg").dialog({
  				width: 400,
  				height: 400,
  				title: "弹出框",
  				buttons: [{
  	  				text: "确定",
  	  				click: function() {
  	  					$(this).dialog("close");
  	  				}  					
  				}, {
  	  				text: "取消",
  	  				click: function() {
  	  					$(this).dialog("close");
  	  				}
  	  			}]
  			});
  			$("#scroll").perfectScrollbar();
  		});
  	</script>
  </body>
</html>
